<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="../js/echarts.min.js"></script>
</head>
<body background="../image/4.jpeg" style=" background-repeat:no-repeat ;background-size:100% 100%;
			background-attachment: fixed;opacity=0.4" >
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));
       //准备数据
      
      


        // 指定图表的配置项和数据
        var option = {
        	xAxis:{
        		type:'category',
        		data:["按摩椅",'跑步机','微波炉','显示器','液晶电视']
        	},
        	axisTick:{
        		alignWithLabel:true,
        	},
        	yAxis:[
        	{
        		name:'金额（元）',
        		nameTextStyle:{
        			color:"#65ABE7",
        			fontSize:12,
        		},
        		type:'value',
        		max:10000
        	},
        	{
        		name:"数量（台）",
        		nameTextStyle:{
        			color:"#65ABE7",
        			fontsize:12
        		},
        		type:"value",
        		max:1500
        	},
        	],
        	grid:{y:"25%",height:"60%"},
        	axisLabel:{color:'white'},
        	legend:{
        		data:['单价','销售数量'],
        		textStyle:{color:"white"},
        		top:'10%'
        },
        series:[
        {
        	name:'单价',
        	data:[800,2200,500,1500,5000],
        	type:'line',
        	yAxisIndex:0,
        	color:'red'
        },
        {
        	name:'销售数量',
        	data:[354,671,494,1123,617],
        	type:'line',
        	yAxisIndex:1
        }
        ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
</body>
</html>